<!DOCTYPE html>
<html>
<head>
    <title> ZTREE DEMO </title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="/css/zTreeStyle.css" type="text/css">
    <script type="text/javascript" src="/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="/js/jquery.ztree.core.js"></script>
    <!--
      <script type="text/javascript" src="jquery.ztree.excheck.js"></script>
      <script type="text/javascript" src="jquery.ztree.exedit.js"></script>93
    -->
    <script type="text/javascript" >
        var zTreeObj,
                setting = {
                    view: {
                        selectedMulti: false
                    }
                },
                zTreeNodes = [
                    {"name":"网站导航", open:true, children: [
                            { "name":"google", "url":"http://g.cn", "target":"_blank"},
                            { "name":"baidu", "url":"http://baidu.com", "target":"_blank"},
                            { "name":"sina", "url":"http://www.sina.com.cn", "target":"_blank"}
                        ]
                    }
                ];

        $(document).ready(function(){
            zTreeObj = $.fn.zTree.init($("#tree"), setting, zTreeNodes);

        });
    </script>
</head>

<body>
<ul id="tree" class="ztree" style="width:230px; overflow:auto;"></ul>
</body>
</html>